<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>获取一句话</button>
    <div class="list"></div>
    <script>
        // 需求 给按钮添加一个点击事件。点击之后发生ajax请求，获取一句话，放到div当中
        let btn = document.querySelector('button');
        let list = document.querySelector('.list');

        btn.onclick = function(){
            // 创建ajax对象
            let  x= new XMLHttpRequest();
            x.open('get','https://v1.hitokoto.cn/?a=c');
            x.send();
            x.responseType = 'json';
            x.onreadystatechange = function(){
                if(x.readyState === 4 && x.status ===200){
                    list.innerHTML += x.response.hitokoto+'<br />';
                }
            }
        }


    </script>
</body>
</html>